{% extends "layout.html" %}
{% block content %}
<div class="x-nav">
    <div class="layui-col-md3">
        <button class="layui-btn"
                onclick="x_admin_show('添加数据点','dataItem-edit.html?channel_id='+channel_id,700,510)"><i
                class="layui-icon"></i>添加数据点
        </button>
    </div>
    <div class="layui-col-md3">
        <button class="layui-btn" id="upload_dataItem_table"><i class="layui-icon"></i>导入点表</button>
        <button class="layui-btn" id="dataItem4collect_templet"
                onclick="javascript:window.open('../dataItem4collect_templet.xls')">下载模板
        </button>
    </div>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
       href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">ဂ</i></a>
</div>
<div class="x-body layui-anim layui-anim-up">
    <div class="layui-fluid">
        <table id="dataItemList" class="layui-table" lay-filter="dataItem">
        </table>
    </div>
    <script type="text/html" id="dataItemBar">
        <div class="layui-btn-group">
            <button type="button" class="layui-btn layui-btn-sm" lay-event="edit"><i class="layui-icon">&#xe642;</i>
            </button>
            <button type="button" class="layui-btn layui-btn-sm" lay-event="del"><i class="layui-icon">&#xe640;</i>
            </button>
        </div>
    </script>
</div>
<style>
    .layui-fluid {
        position: relative;
        margin: 0 auto;
        padding: 0;
    }
    .x-body {
        padding: 0 20px;
    }
</style>
<script>
    var start, end, dataItemTitle;
    var channel_id = GetQueryString('channel_id');
    layui.use(['table', 'form', 'upload'], function () {
        var table = layui.table;
        var upload = layui.upload;
        table.render({
            elem: '#dataItemList'
            , height: 'full-100'
            , url: './dataItemList?channel_id=' + channel_id
            , cols: [[
                // {type:'checkbox', fixed: 'left'}
                {title: 'ID', field: 'dataItem_id', align: 'center', sort: true, fixed: true}
                , {title: '地址', field: 'address', align: 'center'}
                , {title: '标签', field: 'label', align: 'center'}
                , {title: '数据类型', field: 'data_type', align: 'center', sort: true}
                , {title: '数值', field: 'value', align: 'center', sort: true}
                , {title: '时间戳', field: 'timestamp', align: 'center', sort: true}
                , {title: '操作', fixed: 'right', align: 'center', toolbar: '#dataItemBar'}
            ]]
            , page: true
            , limit: 100
            , limits: [50, 100, 200, 500]
        });
        //监听工具条
        table.on('tool(dataItem)', function (obj) {
            var data = obj.data;
            switch (obj.event) {
                case 'edit':
                    x_admin_show('编辑数据点', 'dataItem-edit.html?channel_id=' + obj.data.channel_id + '&dataItem_id=' + obj.data.dataItem_id, 700, 510);
                    break;
                case 'del':
                    if(channel_id==1){
                        layer.alert("默认通道数据点不可删除！");
                        return;
                    }
                    layer.confirm('确认删除？', function (index) {
                        // console.log(obj.data);
                        data = {'dataItem_id': obj.data.dataItem_id};
                        $.ajax(
                            {
                                url: 'delDataItem',
                                type: 'POST',
                                data: data,
                                success: function (data) {
                                    // console.log(data);
                                    if (data.code === 0) obj.del();
                                }
                            });
                        obj.del();
                        layer.close(index);
                    });
                    break;
                default:
            }
        });
        //执行实例
        var uploadInst = upload.render({
            elem: '#upload_dataItem_table' //绑定元素
            , accept: 'file'
            , exts: 'xls|xlsx'
            , acceptMime: 'application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
            , url: 'upload_dataItem_table' //上传接口
            , data: {
                channel_id: channel_id
            }
            , field: 'upload_file'
            , done: function (res) {
                //上传完毕回调
                if (res.code === 0) {
                    layer.alert("导入成功-" + res.msg, {icon: 6}, function () {
                        location.reload();
                    });
                } else {
                    layer.alert("导入失败！" + res.msg, {icon: 6});
                }
            }
            , error: function () {
                //请求异常回调
                layer.alert("导入失败！请检查表格内容", {icon: 6});
            }
        });

        table.on('toolbar(dataItem)', function (obj) {
            if (obj.event === 'import') {
                // 打开文件选择框
                uploadInst.upload();
            }
        });
    });
</script>
{% endblock %}